let id = localStorage.getItem('id')
let scrollIndex = 5;
//header-top
$('.icon-shanchu').click(function () {
  $('.header-top').css('display', 'none')
})
//header-nav
$.get("./data/locationData.json", function (res) {
  let index = res.data.findIndex(function (item) {
    return item == "河南"
  })
  let str = ''
  res.data.forEach(item => {
    str += `<a href="javascript:;"><span>${item}</span></a>`
  });
  $('.locationList').html(str)

  $('.locationList>a>span').eq(index).addClass('locationCheck')
  checkLocation()
});
//地址选择
function checkLocation() {
  let locatBox = document.querySelectorAll('.locationList>a>span')
  $('.locationList>a>span').click(function () {
    let str = $(this).html()
    Array.from(locatBox).forEach(function (item) {
      item.classList.remove('locationCheck')
    })
    $(this).addClass('locationCheck')
    $('.locat').html(str)
    $('.locationList').css('display', 'none')
  })
}
$('.location>li').mouseenter(function () {
  $('.locationList').css('display', 'block')
})
$('.location>li').mouseleave(function () {
  $('.locationList').css('display', 'none')
})


$.get('./data/navData.json', function (res) {
  let data = res.data.myJd
  let str = ''
  data.data.forEach(item => {
    str += `<a href="javascript:;"><span>${item}</span></a>`
  });
  $('.mu_jd_menu1').html(str)
  let str2 = ''
  data.data2.forEach(item => {
    str2 += `<a href="javascript:;"><span>${item}</span></a>`
  });
  $('.mu_jd_menu2').html(str2)
  let data2 = res.data.qiye
  let str3 = ''
  data2.data.forEach(item => {
    str3 += `<a href="javascript:;"><span>${item}</span></a>`
  });
  $('.qiye_menu1').html(str3)

  let data3 = res.data.kehu.kehu
  let str4 = ''
  data3.data.forEach(item => {
    str4 += `<a href="javascript:;"><span>${item}</span></a>`
  });
  str4 = `<div class="kehu_menu1_top">${data3.top}</div>${str4}`
  $('.kehu_menu1').html(str4)

  let data4 = res.data.kehu.shanghu
  let str5 = ''
  data4.data.forEach(item => {
    str5 += `<a href="javascript:;"><span>${item}</span></a>`
  });
  str5 = `<div class="kehu_menu2_top">${data4.top}</div>${str5}`
  $('.kehu_menu2').html(str5)

  let data5 = res.data.wangzhan.tese
  let str6 = ''
  data5.data.forEach(item => {
    str6 += `<a href="javascript:;"><span>${item}</span></a>`
  });
  str6 = `<div class="wangzhan_menu1_top">${data5.top}</div>${str6}`
  $('.wangzhan_menu1').html(str6)

  let data6 = res.data.wangzhan.hangye
  let str7 = ''
  data6.data.forEach(item => {
    str7 += `<a href="javascript:;"><span>${item}</span></a>`
  });
  str7 = `<div class="wangzhan_menu2_top">${data6.top}</div>${str7}`
  $('.wangzhan_menu2').html(str7)

  let data7 = res.data.wangzhan.shanghuo
  let str8 = ''
  data7.data.forEach(item => {
    str8 += `<a href="javascript:;"><span>${item}</span></a>`
  });
  str8 = `<div class="wangzhan_menu3_top">${data7.top}</div>${str8}`
  $('.wangzhan_menu3').html(str8)

  let data8 = res.data.wangzhan.dengduo
  let str9 = ''
  data8.data.forEach(item => {
    str9 += `<a href="javascript:;"><span>${item}</span></a>`
  });
  str9 = `<div class="wangzhan_menu4_top">${data8.top}</div>${str9}`
  $('.wangzhan_menu4').html(str9)
})
let listBoxStr = `<div class="list">
<div class="list-top">
  <a href="javascript:;">家电馆 <span>&gt;</span></a>
  <a href="javascript:;">家电专卖店 <span>&gt;</span></a>
  <a href="javascript:;">家电服务 <span>&gt;</span></a>
  <a href="javascript:;">企业采购 <span>&gt;</span></a>
</div>
<div class="list-main">
  <dl>
    <dt>
      <a href="javascript:;">电视<span>&gt;</span></a>
    </dt>
    <dd>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
    </dd>
  </dl>
  <dl>
    <dt>
      <a href="javascript:;">教育电视<span>&gt;</span></a>
    </dt>
    <dd>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
    </dd>
  </dl>
  <dl>
    <dt>
      <a href="javascript:;">智慧屏<span>&gt;</span></a>
    </dt>
    <dd>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
    </dd>
  </dl>
  <dl>
    <dt>
      <a href="javascript:;">全面屏<span>&gt;</span></a>
    </dt>
    <dd>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
    </dd>
  </dl>
  <dl>
    <dt>
      <a href="javascript:;">OLED<span>&gt;</span></a>
    </dt>
    <dd>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
    </dd>
  </dl>
  <dl>
    <dt>
      <a href="javascript:;">4K超清<span>&gt;</span></a>
    </dt>
    <dd>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">4K超清电视</a>
    </dd>
  </dl>
  <dl>
    <dt>
      <a href="javascript:;">电视<span>&gt;</span></a>
    </dt>
    <dd>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">4K超清电视</a>
    </dd>
  </dl>
  <dl>
    <dt>
      <a href="javascript:;">智慧屏<span>&gt;</span></a>
    </dt>
    <dd>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
    </dd>
  </dl>
  <dl>
    <dt>
      <a href="javascript:;">电视<span>&gt;</span></a>
    </dt>
    <dd>
      <a href="javascript:;">全面屏电视</a>
      <a href="javascript:;">教育电视</a>
      <a href="javascript:;">OLED电视</a>
      <a href="javascript:;">智慧屏</a>
      <a href="javascript:;">4K超清电视</a>
    </dd>
  </dl>
</div>
</div>
<div class="list-right">
  <div class="list-right-con">
    <a href="javascript:;">
      <img src="./image/5bbc6707N5a96386f.jpg.webp" alt="">
    </a>
    <a href="javascript:;">
      <img src="./image/5bbc6707N5a96386f.jpg.webp" alt="">
    </a>
  </div>
</div>`
$('.header-banner-list .listBox').each(function (i, v) {
  v.innerHTML = listBoxStr
})

creatSwiper()
function creatSwiper() {
  let mySwiper = new Swiper('.swiperLeft', {
    loop: true, // 循环模式选项
    autoplay: true,
    // 如果需要分页器
    effect: 'fade',
    delay: 2000,
    pagination: {
      el: '.swiper-pagination',
    },

    // 如果需要前进后退按钮
    navigation: {
      nextEl: '.swiper-button-next',
      prevEl: '.swiper-button-prev',
    },

    // 如果需要滚动条
    scrollbar: {
      el: '.swiper-scrollbar',
    },
  })
  let comtainer = document.querySelector('.swiperLeft');
  comtainer.onmouseenter = function () {
    mySwiper.autoplay.stop();
  };
  comtainer.onmouseleave = function () {
    mySwiper.autoplay.start();
  }
  for (let i = 0; i < mySwiper.pagination.bullets.length; i++) {
    mySwiper.pagination.bullets[i].index = i + 1
    mySwiper.pagination.bullets[i].onmouseover = function () {
      mySwiper.slideTo(this.index)
    }
  }
}
creatSwiper2()
function creatSwiper2() {
  let mySwiper = new Swiper('.swiperRight', {
    loop: true, // 循环模式选项
    autoplay: true,
    // 如果需要分页器
    effect: 'fade',
    delay: 3000,

    // 如果需要前进后退按钮
    navigation: {
      nextEl: '.swiper-button-next',
      prevEl: '.swiper-button-prev',
    },
    // 如果需要滚动条
    scrollbar: {
      el: '.swiper-scrollbar',
    },
  })
  let comtainer = document.querySelector('.swiperRight');
  comtainer.onmouseenter = function () {
    mySwiper.autoplay.stop();
    $('.swiperRightBtn').show()
  };
  comtainer.onmouseleave = function () {
    mySwiper.autoplay.start();
    $('.swiperRightBtn').hide()
  }

}
//秒杀
miaoSha('2021-6-19 23:00:00')
function miaoSha(str) {
  let newTime = new Date()
  let endTime = new Date(str)
  let time = endTime - newTime
  let shi, fen, miao
  if (time >= 0) {
    shi = Math.floor(time / 1000 / 60 / 60 % 24);
    fen = Math.floor(time / 1000 / 60 % 60);
    miao = Math.floor(time / 1000 % 60);
    shi = shi < 10 ? '0' + shi : shi
    fen = fen < 10 ? '0' + fen : fen
    miao = miao < 10 ? '0' + miao : miao
  }
  $('.timeBox span:nth-of-type(1)').html(shi)
  $('.timeBox span:nth-of-type(2)').html(fen)
  $('.timeBox span:nth-of-type(3)').html(miao)
  setTimeout("miaoSha('2021-6-19 23:00:00')", 1000)
}

creatSwiper3()
function creatSwiper3() {
  let uid = localStorage.getItem('id')
  let pagesize = 16;
  let pagenum = 5;
  if (uid) {
    axios.get(productShowUrl, { params: { pagesize, pagenum } }).then(function (res) {
      if (res.status == 200) {
        let str = ''
        let proArr = res.data.data
        for (let i = 0; i < 4; i++) {
          let str2 = ''
          for (let j = i * 4; j < 4 * (i + 1); j++) {
            str2 += `<a class="swiperList" data-id=${proArr[j].pid} href="javascript:;">
                    <div class="swiperList-top">
                      <img src=${proArr[j].pimg} alt="">
                    </div>
                    <p class="swiperList-con">${proArr[j].pdesc}</p>
                    <div class="swiperList-footer">
                      <span class="price-miaosha">
                        <i>￥</i><span>${proArr[j].pprice}</span>
                      </span>
                      <span class="price-origin">
                        <i>￥</i><span>${proArr[j].pprice}</span>
                      </span>
                    </div>
                  </a>`
          }
          str += '<div class="swiper-slide">' + str2 + '</div>'
        }
        $('.main-top-box-swiperList').html(str)
        let mySwiper = new Swiper('.main-top-box-swiper', {
          loop: true, // 循环模式选项
          autoplay: true,
          // 如果需要分页器
          delay: 2000,

          // 如果需要前进后退按钮
          navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
          },
          // 如果需要滚动条
          scrollbar: {
            el: '.swiper-scrollbar',
          },
        })
        let comtainer = document.querySelector('.main-top-box-swiper');
        comtainer.onmouseenter = function () {
          mySwiper.autoplay.stop();
        };
        comtainer.onmouseleave = function () {
          mySwiper.autoplay.start();
        }
      }
    })
  } else {
    axios.get(productShowUrl, { params: { pagesize, pagenum } }).then(function (res) {
      if (res.status == 200) {
        let str = ''
        let proArr = res.data.data
        for (let i = 0; i < 4; i++) {
          let str2 = ''
          for (let j = i * 4; j < 4 * (i + 1); j++) {
            str2 += `<a class="swiperList" data-id=${proArr[j].pid} href="javascript:;">
                    <div class="swiperList-top">
                      <img src=${proArr[j].pimg} alt="">
                    </div>
                    <p class="swiperList-con">${proArr[j].pdesc}</p>
                    <div class="swiperList-footer">
                      <span class="price-miaosha">
                        <i>￥</i><span>${proArr[j].pprice}</span>
                      </span>
                      <span class="price-origin">
                        <i>￥</i><span>${proArr[j].pprice}</span>
                      </span>
                    </div>
                  </a>`
          }
          str += '<div class="swiper-slide">' + str2 + '</div>'
        }
        $('.main-top-box-swiperList').html(str)
        let mySwiper = new Swiper('.main-top-box-swiper', {
          loop: true, // 循环模式选项
          autoplay: true,
          // 如果需要分页器
          delay: 2000,

          // 如果需要前进后退按钮
          navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
          },
          // 如果需要滚动条
          scrollbar: {
            el: '.swiper-scrollbar',
          },
        })
        let comtainer = document.querySelector('.main-top-box-swiper');
        comtainer.onmouseenter = function () {
          mySwiper.autoplay.stop();
        };
        comtainer.onmouseleave = function () {
          mySwiper.autoplay.start();
        }
      }
    })
  }
}


hoverBanner()
function hoverBanner() {
  let lista = document.querySelectorAll('.main-conter-top-lista')
  let listBox = document.querySelectorAll('.main-conter-top-left-listBox')
  let imgArr = ['./image/94611666e48d20c9.jpg.webp', './image/8c2359d793a5fe12.jpg!q70.jpg.webp', './image/65b1c7eb688a666c.jpg!q70.jpg.webp', './image/885d2f005abd7e97.jpg!q70.jpg.webp', './image/feb1253f5557f926.jpg!q70.jpg.webp']
  Array.from(lista).forEach(function (item, i) {
    item.onclick = function () {
      console.log('s' + i)
      for (let i = 0; i < lista.length; i++) {
        lista[i].classList.remove('aClass')
        listBox[i].style.display = 'none'
      }
      this.classList.add('aClass')
      listBox[i].style.display = 'block'
      let imgList = listBox[i].querySelectorAll('img')
      for (let c = 0; c < imgList.length; c++) {
        imgList[c].src = `${imgArr[i]}`
      }
    }
  })
}
longBanner()
function longBanner() {
  let uid = localStorage.getItem('id')
  let pagesize = 20;
  let pagenum = 3;
  if (uid) {
    axios.get(productShowUrl, { params: { pagesize, pagenum } }).then(function (res) {
      if (res.status == 200) {
        let str2 = ''
        let proArr = res.data.data
        for (let j = 0; j < 4; j++) {
          let str = ''
          for (let i = j * 5; i < 5 * (j + 1); i++) {
            if (i % 2 != 0) {
              str += `
                  <div class="swiperListItem">
                      <p>${proArr[i].pdesc}</p>
                      <img src=${proArr[i].pimg} alt="">
                  </div>`
            } else if (i % 2 == 0) {
              str += `
                  <div class="swiperListItem">
                      <img src=${proArr[i].pimg} alt="">
                      <p>${proArr[i].pdesc}</p>
                  </div>`
            }
          }
          str2 += `<div class="swiper-slide">${str}</div>`
        }
        $('.main-center-swiperBox2').html(str2)

        let mySwiper = new Swiper('.main-center-swiperBox', {
          loop: true, // 循环模式选项
          autoplay: {
            delay: 2000
          },
          watchSlidesProgress: true,
          // 如果需要分页器
          scrollbar: {
            el: '.swiper-scrollbar',
            draggable: true,
          },
        })

        let comtainer = document.querySelector('.main-center-swiperBox');
        comtainer.onmouseenter = function () {
          mySwiper.autoplay.stop();
          // mySwiper.scrollbar.$el.css('display', 'block')
        };
        comtainer.onmouseleave = function () {
          mySwiper.autoplay.start();
          // mySwiper.scrollbar.$el.css('display', 'none')
        }
      }
    })
  } else {
    let str2 = ''
    for (let j = 0; j < 4; j++) {
      let str = ''
      for (let i = j * 5; i < 5 * (j + 1); i++) {
        if (i % 2 != 0) {
          str += `
              <div class="swiperListItem">
                  <p>钱雕万琢、相守一生</p>
                  <img src='./image/94611666e48d20c9.jpg.webp' alt="">
              </div>`
        } else if (i % 2 == 0) {
          str += `
              <div class="swiperListItem">
                  <img src='./image/885d2f005abd7e97.jpg!q70.jpg.webp' alt="">
                  <p>一瓶提神醒脑、两瓶永不衰老</p>
              </div>`
        }
      }
      str2 += `<div class="swiper-slide">${str}</div>`
    }
    console.log(str2);
    $('.main-center-swiperBox2').html(str2)

    let mySwiper = new Swiper('.main-center-swiperBox', {
      loop: true, // 循环模式选项
      autoplay: {
        delay: 2000
      },
      watchSlidesProgress: true,
      // 如果需要分页器
      scrollbar: {
        el: '.swiper-scrollbar',
        draggable: true,
      },
    })

    let comtainer = document.querySelector('.main-center-swiperBox');
    comtainer.onmouseenter = function () {
      mySwiper.autoplay.stop();
      // mySwiper.scrollbar.$el.css('display', 'block')
    };
    comtainer.onmouseleave = function () {
      mySwiper.autoplay.start();
      // mySwiper.scrollbar.$el.css('display', 'none')
    }
  }

}
//懒加载
lazyload()
window.addEventListener('scroll', debounce(scrollList, 100))
window.addEventListener('scroll', scrollFixed)
function scrollList() {
  let scrollHeight = document.documentElement.scrollHeight;
  let scrollTop = document.documentElement.scrollTop;
  let height = document.documentElement.clientHeight;
  if (scrollHeight - height - scrollTop <= 800 && scrollHeight <= 20000) {
    scrollIndex++
    lazyload()
  }
  if (scrollTop >= 2000) {
    $('.navfiexd').css('display', 'block')
  } else {
    $('.navfiexd').css('display', 'none')
  }
}
function scrollFixed() {
  let scrollHeight = document.documentElement.scrollHeight;
  let scrollTop = document.documentElement.scrollTop;
  let height = document.documentElement.clientHeight;
  if (scrollTop >= 700) {
    $('.header-search').addClass('search-box-fixed')
  } else {
    $('.header-search').removeClass('search-box-fixed')
  }
  if (scrollTop >= 1800) {
    $('.main-mid-nav').addClass('main-mid-nav-fixed')
  } else {
    $('.main-mid-nav').removeClass('main-mid-nav-fixed')
  }
  let nav = document.querySelector('.main-mid-nav')
  let list = nav.querySelectorAll('li')
  $(list).click(function () {
    document.documentElement.scrollTop = 1600
  })
  $('.goTop').click(function () {
    document.documentElement.scrollTop = 0
  })
  $('.navfiexd ul').children().eq(0).click(function () {
    document.documentElement.scrollTop = 0
  })
  $('.navfiexd ul').children().eq(1).click(function () {
    document.documentElement.scrollTop = 700
  })
  $('.navfiexd ul').children().eq(3).click(function () {
    document.documentElement.scrollTop = 960
  })
  $('.navfiexd ul').children().eq(4).click(function () {
    document.documentElement.scrollTop = 1300
  })
  $('.navfiexd ul').children().eq(5).click(function () {
    document.documentElement.scrollTop = 1600
  })
}

//防抖
// function debounce (fn, time) {
//   let timer = null //定义初始状态
//   return function () {
//     let that = this
//     clearTimeout(timer) //每次触发都清除定时器
//     timer = setTimeout(function () {
//       fn.call(that)
//     }, time)
//   }
// }
//节流
function debounce(fn, delay) {
  var timer = null //定义初始状态
  return function () {
    if (!timer) {

      timer = setTimeout(function () {
        fn()
        timer = null
      }, delay)
    } else {
      return false
    }
  }
}

function lazyload() {
  let pagesize = 20
  let pagenum = scrollIndex;
  axios.get(productShowUrl, { params: { pagesize, pagenum } }).then(function (res) {
    if (res.status = 200) {
      let str = ''
      let proArr = res.data.data
      for (let i = 0; i < proArr.length; i++) {
        str += `<li>
        <a href="detail.html?id=${proArr[i].pid}">
          <div>
            <img src=${proArr[i].pimg} alt="">
          </div>
          <div>
            <p><i>自营</i><span>${proArr[i].pdesc}</span></p>
            <div>
              <div>
                <i>￥</i><span>${proArr[i].pprice}</span><span>.00</span>
              </div>
              <p>
                <i>券</i>
              </p>
            </div>
          </div>
        </a>
      </li>`
      }
      let str2 = $('.main-mid-content>ul').html()
      $('.main-mid-content>ul').html(str2 + str)
    }
  })
}
let username = localStorage.getItem('username')
let token = localStorage.getItem('token')
if (username && token) {
  $('.login-reg p').eq(0).css('display', 'none')
  $('.login-reg p').eq(1).css('display', 'block')
  $('.loginInfo').html(username)
  $('.youke').css('display', 'none')
  $('.loginUser').css('display', 'block')
  $('.userMsg').html(username)
} else {
  $('.login-reg p').eq(0).css('display', 'block')
  $('.login-reg p').eq(1).css('display', 'none')
  $('.loginInfo').html()
  $('.youke').css('display', 'block')
  $('.loginUser').css('display', 'none')
  $('.userMsg').html()
}
$('.closeLogin').click(function () {
  localStorage.removeItem('username')
  localStorage.removeItem('id')
  localStorage.removeItem('token')
  location.href = "index.html"
})
$('.tuichu').click(function () {
  localStorage.removeItem('username')
  localStorage.removeItem('id')
  localStorage.removeItem('token')
  location.href = "index.html"
})
//购物车数字
zongshu()
function zongshu() {
  let shopNum = document.querySelector('.search-shop-num')
  if (id) {
    axios.get(selectCartUrl, { params: { id } }).then(function (res) {
      let arr = res.data.data;
      let snum = 0
      Array.from(arr).map(function (item) {
        return snum += Number(item.pnum)
      })
      shopNum.innerHTML = snum
    })
  } else {
    shopNum.innerHTML = 0
  }
}
let shopBtn = document.querySelector('.search-shop')
shopBtn.onclick = function () {
  if (id) {
    location.href = 'shopCart.html'
  } else {
    alert('请登录')
  }
}

//搜索
select.oninput = function () {
  let list = document.querySelector('.searchlist')
  list.style.display = "block"
  if (select.value.length != 0) {
    let value = select.value
    var url = `https://www.baidu.com/sugrec?callback=list&prod=pc_hao123&wd=${value}`
    var script = document.createElement('script')
    script.src = url
    document.body.appendChild(script)
  } else {
    list.innerHTML = ''
  }

}
function liClick() {
  let listItem = document.querySelector('.searchlist').children
  Array.from(listItem).forEach(function (item) {
    item.onclick = function () {
      select.value = this.innerHTML
      let list = document.querySelector('.searchlist')
      list.style.display = 'none'
    }
  })
}
function list(res) {
  let arr = res.g
  let list = document.querySelector('.searchlist')
  let str = ''
  if (arr != undefined) {
    let brr = arr.map(function (item) {
      return `<li>${item.q}</li>`
    })
    str = brr.join('')
    list.innerHTML = str
    liClick()
  } else {
    list.innerHTML = ''
  }
}

